﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="PageTitle" runat="server">
    <title>添加员工</title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="PageStyles" runat="server">
    <style type="text/css">
        .text
        {
            width: 200px;
        }
    </style>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="PageScripts" runat="server">
    <script type="text/javascript">
        //************* URL常量

        var URL_ADD_USER = '/Staff/DoAddUser';
        var URL_CHECK_USER_EXIST = '/Staff/DoCheckUserExist';

        //************* Accessor访问器
        var EzAccessor = {};

        function CreateAccessor() {
            EzAccessor = CreateRealEzAccessor();
        }

        function CreateRealEzAccessor() {
            //实现服务器交互方法
            var realEzAccessor = {
            };

            return realEzAccessor;
        }

        //添加用户
        function addUser() {
            var name = $('#txtName').val();
            var userName = $('#txtUserName').val();
            var deptId = $('#cmbDept').val();
            var positionId = $('#cmbPosition').val();
            var qqNumber = $('#txtQq').val();
            var mobileNo = $('#txtMobile').val();
            var mainEmail = $('#txtEmail').val();
            var isHr = $('#isHR').attr("checked");
            var pwd = $('#txtPwd').val();

            EzDesk.Service.DoAddUser(function (e) {
                if (e.Status == "Success") {
                    $('.page-submit').ajaxBusyProgress();

                    var groupIds = getGroupListChecked();
                    var userId = e.Data.UserId;
                    EzDesk.Service.DoUpdateUserGroups(function (statusInfo) {
                        if (statusInfo.Status == "Success") {
                            var url = '/Staff/Staff?UserId={UserId}';
                            url = url.replace("{UserId}", userId);
                            $.redirectAndDisplayInfo(url, e);
                        } else {
                            $.displayStatusInfo(statusInfo);

                            $('.page-submit').ajaxBusyProgress('reset');
                        }
                    }, { groupIdStrs: groupIds, userId: userId })
                }
                else {
                    $('.page-submit').ajaxBusyProgress('reset');
                }

            }, {
                name: name,
                deptId: deptId,
                positionId: positionId,
                userName: userName,
                pwd: pwd,
                qqNumber: qqNumber,
                mobileNo: mobileNo,
                mainEmail: mainEmail
            });
        }




        function getDeptListForArray(deptList) {
            var deptListForArray = [];
            for (var key in deptList) {
                var name = deptList[key].DeptName;
                var id = deptList[key].Id;

                deptListForArray.push({ 'text': name,
                    'value': id
                });
            }
            return deptListForArray;
        }


        function getPositionListForArray(positionList) {
            var positionListForArray = [];
            for (var key in positionList) {
                var name = positionList[key].Description;
                var id = positionList[key].Id;

                positionListForArray.push({ 'text': name,
                    'value': id
                });
            }
            return positionListForArray;
        }

        function getGroupListForArray(groupList) {
            var groupListForArray = [];
            for (var key in groupList) {
                var name = groupList[key].Description;
                var id = groupList[key].Id;

                groupListForArray.push({ 'text': name,
                    'value': id
                });
            }
            return groupListForArray;
        }

        //绑定部门列表
        function bindDeptList(deptList) {
            var deptListForArray = getDeptListForArray(deptList);
            $('#cmbDept')
                .comboxBinding(deptListForArray, 'text', 'value');
        }

        //绑定职位
        function bindPositionList(positionList) {
            var positionListForArray = getPositionListForArray(positionList);
            $('#cmbPosition')
                .comboxBinding(positionListForArray, 'text', 'value');
        }


        //绑定用户组
        function bindGroupList(groupList) {
            for (var key in groupList) {
                var groupText = groupList[key].Description;
                var groupDom = $('<input type="checkbox"/>')
            .val(groupList[key].Id)
            .attr({ id: groupList[key].Id });

                $('#cmbGroup').append(groupDom).append(groupText).append('<br />');

                if (groupText == "所有在职员工") {
                    $('#' + groupList[key].Id)
                .attr({
                    'checked': true,
                    'disabled': true
                })
                }
            }
        }


        //初始化页面
        function initPage() {
            CreateAccessor();
            EzDesk.Service.PermissionGroups(function (groups) {
                bindGroupList(groups);
            });
            EzDesk.Service.AllPositions(function (positions) {
                bindPositionList(positions);
            });
            EzDesk.Service.AllDepts(function (depts) {
                bindDeptList(depts);
            });

            InitValidation();
        }

        function InitValidation() {
            $.validator.addMethod('checkUserExist',
            function (value, element) {
                var isValidateSucc = false;
                EzDesk.Service.DoCheckUserExist_Sync(function (e) {
                    isValidateSucc = !e.IsExisted;
                },
                    { userName: value }
                );
                
                return isValidateSucc;
            },
        '这个用户名已经存在');

            $("#contactForm").validate({
                onkeyup: false,
                rules: {
                    txtPwd: {
                        required: true,
                        minlength: 5
                    },
                    txtPwdConfirm: {
                        equalTo: "#txtPwd"
                    },
                    txtName: {
                        required: true
                    },
                    txtUserName: {
                        required: true,
                        checkUserExist: true
                    },
                    txtEmail: { email: true }, txtMobile: { digits: true, minlength: 11 }, txtQq: { digits: true }
                },
                messages:
            {
                txtPwd:
                    {
                        required: "请输入密码",
                        minlength: "密码不能少于5位"
                    },
                txtPwdConfirm: "两次输入密码不一致",
                txtName: "请输入姓名",
                txtUserName: { required: "请指定用户名", checkUserExist: "用户名已存在，请指定其他用户名" },
                txtEmail: "不是有效的邮箱地址",
                txtMobile: { digits: "请输入数字", minlength: "不能少于11位" },
                txtQq: "请输入数字"
            }
            });

        }

        function getGroupListChecked() {
            var idList = [];
            $('#cmbGroup input').each(function (index, item) {
                if ($(item).attr('checked')) {
                    idList.push($(item).val());
                }
            })

            return idList.join(',');
        }

        //初始化事件
        function initPageEvent() {
            $('#lblAddr').click(function () {
                if ($('#chkContact').attr("checked")) {
                    $('#cmbContact').show()
                } else {
                    $('#cmbContact').hide()
                }
            });

            $('#btnSubmit').click(function () {
                var validSuccess = $("#contactForm").valid();
                if (validSuccess) addUser();
            });

            $('#btnRecover').click(function () {
                $('.text').clearFields();
                $('.chkBox').attr("checked", false);
                $('#cmbContact').hide();
            });

        }

        $(function () {
            initPage();
            initPageEvent();
        });

    </script>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="PageHead" runat="server">
    <%
        Html.RenderPartial("_sayHello"); %>
</asp:Content>
<asp:Content ID="Content5" ContentPlaceHolderID="PageContent" runat="server">
    <div id="page-head" class="page-head">
        <div id="links">
            <a href="/staff" class="head">管理员工</a>
        </div>
        <img src="../../Content/icons/add_user.png" style="width: 48px; height: 48px;" alt="add" />
        <span class="title">添加员工</span>
    </div>
    <div id="page-body">
        <div class="content">
            <form id="contactForm" name="contactForm">
            <div style="width: 480px;">
                <div class="content-section">
                    <p class="entry-explanation">
                        用户信息</p>
                    <span>设置新员工的基本信息 : 姓名 部门 </span>
                    <div class="formBox">
                        <ul class="fieldslist">
                            <li>
                                <div class="l">
                                    <label>
                                        姓名：
                                    </label>
                                </div>
                                <div class="r">
                                    <input id="txtName" name="txtName" class="text" />
                                </div>
                            </li>
                            <li>
                                <div class="l">
                                    <label>
                                        部门：
                                    </label>
                                </div>
                                <div class="r">
                                    <select id="cmbDept" style="padding: 2px;" name="deptList" value="选择部门" class="text">
                                    </select>
                                </div>
                            </li>
                            <li>
                                <div class="l">
                                    <label>
                                        职位：
                                    </label>
                                </div>
                                <div class="r">
                                    <select id="cmbPosition" style="padding: 2px;" name="positionId" value="选择职位" class="text">
                                    </select>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="content-section">
                    <p class="entry-explanation">
                        用户组分配</p>
                    <span>分配新员工所属的公司用户组</span>
                    <div class="formBox">
                        <ul class="fieldslist">
                            <li>
                                <div class="l">
                                    <label>
                                        用户组：
                                    </label>
                                </div>
                                <div class="r">
                                    <div id="cmbGroup" style="padding: 2px;">
                                    </div>
                                    <input type="hidden" id="txt-groupList" />
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="content-section">
                    <p class="entry-explanation">
                        登陆信息</p>
                    <span>设置新员工的登陆用户名和初始密码 </span>
                    <div class="formBox">
                        <ul class="fieldslist">
                            <li>
                                <div class="l">
                                    <label>
                                        用户名：
                                    </label>
                                </div>
                                <div class="r">
                                    <input id="txtUserName" name="txtUserName" class="text" />
                                </div>
                            </li>
                            <li>
                                <div class="l">
                                    <label>
                                        密码：
                                    </label>
                                </div>
                                <div class="r">
                                    <input id="txtPwd" name="txtPwd" type="password" class="text" />
                                </div>
                            </li>
                            <li>
                                <div class="l">
                                    <label>
                                        密码确认：
                                    </label>
                                </div>
                                <div class="r">
                                    <input id="txtPwdConfirm" name="txtPwdConfirm" type="password" class="text" />
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="content-section">
                    <p class="entry-explanation">
                        联系方式</p>
                    <span>设置新员工的联系方式 : 电话 QQ 邮箱（可以不填写） </span>
                    <div style="margin-top: 5px; margin-bottom: 20px;">
                        <label id="lblAddr" for="chkContact">
                            <input type="checkbox" id="chkContact" class="chkBox" />添加新员工的联系方式</label>
                        <div id="cmbContact" class="formBox" style="display: none;">
                            <ul class="fieldslist">
                                <li>
                                    <div class="l">
                                        <label>
                                            电话：
                                        </label>
                                    </div>
                                    <div class="r">
                                        <input id="txtMobile" name="txtMobile" type="text" class="text" minlength="11" maxlength="11" />
                                    </div>
                                </li>
                                <li>
                                    <div class="l">
                                        <label>
                                            邮箱：
                                        </label>
                                    </div>
                                    <div class="r">
                                        <input id="txtEmail" name="txtEmail" class="text email" />
                                    </div>
                                </li>
                                <li>
                                    <div class="l">
                                        <label>
                                            QQ：
                                        </label>
                                    </div>
                                    <div class="r">
                                        <input id="txtQq" name="txtQq" class="text number" minlength="5" maxlength="12" />
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
            </form>
        </div>
    </div>
    <div class="page-submit">
        <div id="btnSubmit">
            确认添加</div>
        <script type="text/javascript">
            $(function () {
                $("#btnSubmit").button({
                    icons: {
                        primary: "ui-icon-circle-check"
                    },
                    text: true
                });
            });
        </script>
        &nbsp;或者&nbsp;<a id="btnRecover">取消</a>
    </div>
</asp:Content>
<asp:Content ID="Content6" ContentPlaceHolderID="PageShortcut" runat="server">
</asp:Content>
<asp:Content ID="Content7" ContentPlaceHolderID="PageFoot" runat="server">
    <div id="tip_alert" style="display: none;">
    </div>
</asp:Content>
